<template>
  <!-- 2 ytq订单设置 -->
  <div class="addProduct">
    <div class="breadcrumb">
      <Breadcrumb :aaa="aaa" :msgg="msg" :txt="txt" :path1="path1" />
    </div>

    <div class="form-container">
      <el-card body-style="padding-bottom:35px">
        <!-- 内容 -->
        <div class="el-card__body">
          <!-- 输入框 -->
          <div class="f">
            <span class="ml-3 w-35 text-gray-600 inline-flex items-center"
              >秒杀订单超过：&nbsp;&nbsp;&nbsp;</span
            >
            <el-input
              prepend="append"
              class="w-50 m-2"
              v-model="input1"
              label="秒杀订单超过："
            >
              <template #append>分</template>
            </el-input>
            <span class="ml-3 w-35 text-gray-600 inline-flex items-center"
              >&nbsp;&nbsp;&nbsp;未付款，订单自动关闭</span
            >
          </div>
          <div class="f">
            <span class="ml-3 w-35 text-gray-600 inline-flex items-center"
              >正常订单超过：&nbsp;&nbsp;&nbsp;</span
            >
            <el-input
              prepend="append"
              class="w-50 m-2"
              v-model="input2"
              label="秒杀订单超过："
            >
              <template #append>分</template>
            </el-input>
            <span>&nbsp;&nbsp;&nbsp;未付款，订单自动关闭</span>
          </div>
          <div class="f">
            &nbsp;<span class="send">发货超过：&nbsp;&nbsp;&nbsp;&nbsp;</span>
            <el-input
              prepend="append"
              class="w-50 m-2"
              v-model="input3"
              label="秒杀订单超过："
            >
              <template #append>天</template>
            </el-input>
            <span>&nbsp;&nbsp;&nbsp;未付款，订单自动完成</span>
          </div>
          <div class="f">
            <span>订单完成超过：&nbsp;&nbsp;&nbsp;</span>
            <el-input
              prepend="append"
              class="w-50 m-2"
              v-model="input4"
              label="秒杀订单超过："
            >
              <template #append>天</template>
            </el-input>
            <span>&nbsp;&nbsp;&nbsp;自动结束交易，不能申请售后</span>
          </div>
          <div class="f">
            <span>订单完成超过：&nbsp;&nbsp;&nbsp;</span>
            <el-input
              prepend="append"
              class="w-50 m-2"
              v-model="input5"
              label="秒杀订单超过："
            >
              <template #append>天</template>
            </el-input>
            <span>&nbsp;&nbsp;&nbsp;自动五星好评</span>
          </div>
          <el-button
            class="submit"
            type="primary"
            style="
              margin-top: 12px;
              transform: translateX(130px);
              padding: 15px 20px;
            "
            @click="submit"
            >提交
          </el-button>
        </div>
      </el-card>
    </div>
  </div>
</template>

<script lang="ts" setup>
import {
  ref,
  reactive,
  watch,
  onBeforeUnmount,
  shallowRef,
  onMounted,
} from "vue";
import { ElMessage, ElMessageBox } from "element-plus";
import * as api from "../../request/api";
import Breadcrumb from "../../components/breadcrumb.vue";
let msg = ref("订单设置");
let txt = ref("订单");
let path1 = ref("oms/order");
let aaa = ref(0);

const input1 = ref("");
const input2 = ref("");
const input3 = ref("");
const input4 = ref("");
const input5 = ref("");

//提交 修改
let id = 1;
let submit = () => {
  ElMessageBox.confirm("是否要提交修改? ", "提示", {
    confirmButtonText: "确定",
    cancelButtonText: "取消",
    type: "warning",
  })
    .then(async () => {
      await api.orderSetting.orderSetting({ id });
      await api.orderSetting.orderSettingDetail({ id });
      ElMessage({
        type: "success",
        message: "提交成功",
      });
    })
    .catch(() => {
      ElMessage({
        type: "info",
        message: "取消提交",
      });
    });
};
// //详情 回显
// let onOwn = async () => {
// }
// onOwn()
//
</script>

<style lang="scss" scoped>
.send {
  margin-left: 23px;
}

.form-container {
  left: 0;
  right: 0;
  width: 720px;
  padding: 27px 35px 15px 35px;
  margin: 20px auto;
  width: 820px;
}

.addProduct {
  background-color: white;
  height: 100vh;
}

.input-with-select .el-input-group__prepend {
  background-color: var(--el-fill-color-blank);
}

.f {
  display: flex;
  justify-content: start;
  align-items: center;
  margin-bottom: 20px;
}

.el-input-group {
  width: 40%;
}

.breadcrumb {
  height: 45px;
  border-bottom: 1px solid #ebeef5;
  font-size: 20px;
}

.el-card.is-always-shadow {
  box-shadow: none;
}

.el-card__body {
  padding: 50px 100px !important;
  width: 720px;
}

.el-card {
  border-radius: 4px;
  border: 1px solid#ebeef5;
  background-color: #fff;
  overflow: hidden;
  color: #303133;
  transition: 0.3s;
}
</style>
